<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>冻结卡资金来源视图</title>
    <script src="/static/js/echarts.js"></script>
    <script src="/static/js/jquery.min.js"></script>
    <script src="/static/js/dataTool.min.js"></script>
</head>
<body>
<center>
    <form action="/frozen" method="get">
        <h4>查询冻结卡号信息: <input type="text" name="bankno" />
            <input type="submit" value="提交" /></h4>
        <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
    </form>
    <form action="/turnover" method="get">
        <h4>查询资金来源: <input type="text" name="countbankno" />
            <input type="submit" value="提交" /></h4>
        <div id="main" style="width: 1024px;height: 768px;"></div>
    </form>
</center>
<script type="text/javascript">
    // 基于准备好的dom，初始化echarts实例
    var myChart = echarts.init(document.getElementById('main'));
    var option;
    myChart.showLoading();
    $.get('/turnover', function (data) {
        myChart.hideLoading();

        myChart.setOption(option = {
            title: {
                text: '冻结卡资金来源视图'
            },
            tooltip: {
                trigger: 'item',
                triggerOn: 'mousemove'
            },
            animation: false,
            series: [
                {
                    type: 'sankey',
                    focusNodeAdjacency: 'allEdges',
                    nodeAlign: 'left',
                    data: data.nodes,
                    links: data.links,
                    lineStyle: {
                        normal: {
                            color: 'source',
                            curveness: 0.5
                        }
                    }
                }
            ]
        });
    });
</script>
</body>
</html>
